<!--
 * @description: 
 * @Date: 2022-12-19 10:30:43
 * @example: 
 * @params: 
-->
<template>
  <div>
    <Header class="header">
        <Menu mode="horizontal" theme="dark" active-name="1">
          <div class="layout-logo"></div>
          <div class="layout-nav">
            <MenuItem name="1" to="/home/index">
              <Icon type="ios-navigate"></Icon>
              首页
            </MenuItem>
            <MenuItem name="2" to="/PersonCenter">
              <Icon type="ios-keypad"></Icon>
              个人中心
            </MenuItem>
            <MenuItem name="3" to="/Myphotos">
              <Icon type="ios-keypad"></Icon>
              我的图库
            </MenuItem>
            <MenuItem name="4">
              <Icon type="ios-log-out"></Icon>
              <span >退出登录</span>
            </MenuItem>
          </div>
        </Menu>
      </Header>
  </div>
</template>
<script>
export default {
  data() {
    return {

    }
  },
  mounted(){

  },
  computed:{

  },
  methods:{

  },
}
</script>
<style scoped>
.layout-logo {
  width: 100px;
  height: 30px;
  border-radius: 3px;
  float: left;
  position: relative;
  top: 15px;
  left: 20px;
}
.layout-nav {
  width: 500px;
  margin: 0 auto;
  margin-right: 20px;
  background: #141437;
}
.ivu-layout-header{
    background-color: #141437;
}
.ivu-menu-dark {
    background-color: #141437;
}
</style>
